<template>
	<view>
		<view class="title" @click="back">
			<uni-icons type="back" size="22" style="margin-left: 20rpx;"></uni-icons>
			<text>我的</text>
		</view>
		<view class="header">
			<image src="../../static/QQ图片20230103165113.jpg" mode=""></image>
			<text>花花-花卉师</text>
			<view>在线咨询</view>
		</view>
		<view class="content">
			<view class="item" v-for="(v,i) in items">
				<view class="head">
					<image src="../../static/QQ图片20230103165113.jpg" mode=""></image>
					<view class="title">
						<view>{{v.nickName}}</view>
						<view>{{v.lunchTime}}</view>
					</view>
					<uni-icons type="more-filled" size="20" style="float: right;" @click="more(i)"></uni-icons>
				</view>
				<view class="center" @click="topost(i)">
					<text>{{v.lunchTitle}}</text>
					<view class="images">
						<image :src="v.imgData" mode=""></image>
						<view class="image_box">
							<uni-icons type="image" size="15" color="white"></uni-icons>
							<text>1</text>
						</view>
					</view>
				</view>
				<view class="bottom">
					<text>{{v.lunchLabel}}</text>
					<view class="">
						<uni-icons type="heart" size="20" :color="guan==1?'#d8224a':'#000'" @click="guanzhu">
						</uni-icons>
						<text style="width: 40rpx;">111</text>
						<uni-icons type="chat-filled" size="20"></uni-icons>
						<text style="width: 40rpx;">999</text>
						<uni-icons type="redo" size="20"></uni-icons>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import http from '../../utils/http';
	export default {
		data() {
			return {
				items: [],
				userid: 1,
			}
		},
		onLoad() {
			this.getuser(this.userid);
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			getuser(id) {
				uni.request({
					method: 'GET',
					url: 'http://mnxc.xyz:8080/lunch/getByUserId?id=' + id,
					success: (res) => {
						this.items = res.data.data;
						console.log(this.items);
					}
				})
			},
			more(i) {
				uni.showModal({
					title: '提示',
					content: '确认删除该条帖子吗？',
					success: (res)=>{
						if (res.confirm) {
							// 执行确认后的操作
							http({
								url:'/lunch/'+this.items[i].lunchId,
								method:'delete',
								data:{
									ids:this.items[i].lunchId
								},
								success:(res)=>{
									if(res.data.msg =='此数据关联其他数据，不能删除'){
										uni.showToast({titile : '此数据关联其他数据，不能删除',icon : 'error'})
									}else{
										uni.showToast({titile: '删除成功',icon : ' success ' })
									}
								}
							})
						} else {
							// 执行取消后的操作
						}
					}
				})
			},
			topost(i) {
				uni.navigateTo({
					url: '/pages/community/tiezidetails?i=' + i + '&userid=' + this.userid,
				})
			},
		},
	}
</script>

<style>
	.title {
		display: flex;
		align-items: center;
		margin-top: 70rpx;
	}

	.header {
		height: 100rpx;
		display: flex;
		align-items: center;
		position: relative;
	}

	.header image {
		height: 60rpx;
		width: 60rpx;
		border-radius: 50%;
		margin: 0 20rpx;
	}

	.header text {
		font-size: 30rpx;
		font-weight: bold;
	}

	.header view {
		font-size: 30rpx;
		width: 130rpx;
		text-align: center;
		border: 1rpx solid #0055ff;
		color: #0055ff;
		right: 20rpx;
		border-radius: 5rpx;
		position: absolute;
	}

	.content {
		padding: 0 20rpx;
	}

	.content .item {
		width: 710rpx;
		border-top: 1px solid #e6e6e6;
		border-bottom: 1px solid #e6e6e6;
	}

	.content .item .head {
		height: 70rpx;
		margin-top: 10rpx;
	}

	.content .item .head image {
		height: 60rpx;
		width: 60rpx;
		border-radius: 50%;
	}

	.content .item .head .title {
		padding: 0;
		margin: 0;
		margin-left: 20rpx;
		display: inline-block;
	}

	.content .item .head .title view {
		padding: 0;
		margin: 0;
		display: block;
	}

	.content .item .head .title view:nth-child(1) {
		font-size: 27rpx;
	}

	.content .item .head .title view:nth-child(2) {
		font-size: 22rpx;
	}

	.content .item .center text {
		font-size: 35rpx;
	}

	.content .item .center .images {
		width: 100%;
		display: flex;
		justify-content: space-between;
		position: relative;
	}

	.content .item .center .images image {
		width: 230rpx;
		height: 225rpx;
	}

	.content .item .center .images .image_box {
		position: absolute;
		width: 65rpx;
		right: 10rpx;
		bottom: 10rpx;
		background-color: #737373;
		border-radius: 15rpx;
		display: flex;
		align-items: center;
	}

	.content .item .center .images .image_box text {
		font-size: 25rpx;
		margin-left: 5rpx;
		color: #fff;
	}

	.content .item .bottom {
		height: 50rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.content .item .bottom text {
		font-size: 25rpx;
		margin-left: 5rpx;
	}

	.content .item .bottom text:nth-child(1) {
		color: #41c20c;
	}
</style>
